<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Qyxzp</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <style>
  /* Loading 动画 */
    html,
    body,
    root {
        height: 100%;
        margin: 0;
    }

    .splash-screen {
        background-color: #303030;
        position: relative;
        height: 100%;
        width: 100%;
    }

    .splash-logo {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 50px;
        height: 50px;
        margin-left: -25px;
        margin-top: -25px;
        z-index: 2;
        text-align: center;
        color: #ffffff;
        line-height: 46px;
        font-size: 32px;
        display: block;
    }

    .splash-loader,
    .splash-loader::before,
    .splash-loader::after {
        left: 50%;
        top: 50%;
        margin-left: -50px;
        margin-top: -50px;
        position: absolute;
        vertical-align: middle;
        background: #fff;
        width: 100px;
        height: 100px;
        border-radius: 50%;
        z-index: 1;
    }

    .splash-loader::before {
        content: "";
        animation: bounce 1.5s infinite;
    }

    .splash-loader::after {
        content: "";
        animation: bounce 1.5s -0.4s infinite;
    }

    @keyframes bounce {
        0% {
            transform: scale(0.8);
            -webkit-transform: scale(0.8);
            opacity: 1;
        }

        100% {
            transform: scale(2);
            -webkit-transform: scale(2);
            opacity: 0;
        }
    }

    @-webkit-keyframes bounce {
        0% {
            transform: scale(0.8);
            -webkit-transform: scale(0.8);
            opacity: 1;
        }

        100% {
            transform: scale(2);
            -webkit-transform: scale(2);
            opacity: 0;
        }
    }
</style>
</head>
<body>
  <app-root>
    <div class="splash-screen">
      <div class="splash-loader"></div>
      <img class="splash-logo" src="assets/img/avatars/ym.png"></div>
    </div>
  </app-root>
</body>
</html>
